<!doctype html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>请登录</title>
    <link rel="stylesheet" href="/layui/css/layui.css">
    <style>
        body {
            height: 100vh;
            display: flex;
            align-items: center;
        }
        form {
            width: 90%;
            margin-left: auto;
            margin-right: auto;
            display: flex;
            justify-content: center;
            flex-direction: column;
        }
        form>div {
            text-align: center;
        }
        form>div:not(:first-child) {
            margin-top: 1.5rem;
        }
        @media (min-width: 900px) {
            form {
                width: 500px;
            }
        }
    </style>
</head>
<body>
<form id="login-form" method="post" class="layui-form" action="">
    <div>
        <label>
            <input style="width: 100%;" type="password" name="password" id="password" required="required" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
        </label>
    </div>
    <div style="text-align: unset !important;">
        <input class="layui-input" id="remember" name="remember" type="checkbox" value="1" title="记住我">
    </div>
    <div>
        <button id="btn" type="button" class="layui-btn" lay-submit lay-filter="formDemo">提交</button>
    </div>
</form>
<script src="/layui/layui.js"></script>
<script>
    //Demo
    layui.use(['form', 'layer', 'jquery'], function(){
        let form = layui.form;
        let layer = layui.layer;
        let $ = layui.$;
        //提交
        form.on('submit(formDemo)', function(data){
            submit(data.field);
        });
        $(document).ready(function () {
            $("input").keydown(function (event) {
                if (event.keyCode === 13) {
                    //这里写事件，例如写个 a();
                    submit($('#login-form').serialize())
                    return false
                }
            });
        });
        form.render();
        function submit(data) {
            $.ajax({
                type: 'POST',
                data: data,
                dataType: 'JSON',
                success: function (res) {
                    if (res.code === 1) {
                        console.log(res.data)
                        window.location.href = res.data;
                        return false;
                    }else{
                        layer.msg(res.msg, {icon: 2, anim: 6});
                    }
                },
                error: function (xhr, textStatus, request) {
                    layer.msg('服务器错误，请稍后再试', {icon:2, time:1000})
                },
            })
            return false;
        }
    });



</script>
</body>
</html>